<template>
  <div id="app" class="heightWeight">
    <div class="files-title">
      <h3>身高体重增长曲线</h3>
      <p>{{ searchData.stuName }} 在 {{ searchData.semesterName }} 长高 <span>{{height}} cm</span>，体重增加 <span>{{ weight }} kg</span></p>
    </div>
    <line-bar ref="lineBar" :chartData="chartData" :YAxis="YAxis" v-on="$listeners"></line-bar>
  </div>
</template>
<script>
import { StudengFiles } from '@/utils/skStudentFilesMixin.js'
import LineBar from '../modules/line-bar.vue'
export default {
  name: 'heightWeight',
  mixins:[StudengFiles],
  data() {
    return {
      url: {
        query: '/health/skBmiRecord/queryStudentClassBmiByMonth'
      },
      chartData: [
        {
          legendTitle: '班级平均身高',
          type: 'bar',
          color: ['#FF9A22 ', '#FFD56E']
        },
        {
          legendTitle: '身高',
          type: 'bar',
          color: ['#00FFE3', '#4693EC']
        },
        {
          legendTitle: '班级平均体重',
          type: 'line',
          color: ['#FFD814']
        },
        {
          legendTitle: '体重',
          type: 'line',
          color: ['#00C6F4']
        }
      ],
      YAxis: [
        {
          name: 'cm',
          position: 'left'
        },
        {
          name: 'kg',
          position: 'right'
        }
      ],
      height:0,
      weight:0
    }
  },
  components: {
    LineBar
  },
  props: ['dataForm', 'semesterName', 'className'],
  filters: {},

  computed: {},

  created() {},

  activated() {},


  methods: {
    // /查看单个幼儿数据
    async initStudentChart() {
      const params = {
        classId:this.searchData.classId
      }
      let data = await this.queryData(params);
      let categorys = [],xData = [];
      const monthColumns = this.dataForm.daysColums;
      let arr1 = [],arr2 = [],arr3 = [],arr4 = [];
      for(let rowIndex = 0; rowIndex < monthColumns.length; rowIndex++){
        const rowString = monthColumns[rowIndex].toString();
        categorys.push(rowString);
        const monthData = data.find(item => item.month == rowString);
        if (monthData){
          arr1.push(monthData.avgHeight)
          arr2.push(monthData.height)
          arr3.push(monthData.avgWeight)
          arr4.push(monthData.weight)
          
        } else {
          arr1.push(0)
          arr2.push(0)
          arr3.push(0)
          arr4.push(0)
        }
      }
      xData.push(arr1,arr2,arr3,arr4)
      if (data.length > 0) {
        let sortData = data.sort((a,b)=>{
          return Number(b.month.substring(0,5)) - Number(a.month.substring(0,5))
        })
        this.height = (sortData[sortData.length - 1].height - sortData[0].height).toFixed(1);
        this.weight = (sortData[sortData.length - 1].weight - sortData[0].weight).toFixed(1);
      }
      this.$refs.lineBar.initEChart(categorys,xData)
    }
  }
}
</script>
<style scoped>
/* @import url(); 引入css类 */
@import url(~@/assets/less/studentFiles.css); 
</style>
